<template>
  <div>
    <!--  1.轮播-->
    <div style="width: 90%;margin-left: 5%;border-radius: 10px;">
      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
        <van-swipe-item>1</van-swipe-item>
        <van-swipe-item>2</van-swipe-item>
        <van-swipe-item>3</van-swipe-item>
        <van-swipe-item>4</van-swipe-item>
      </van-swipe>
    </div>
    <div>
      <div>
        <h3 style="margin-left: 20px;border-left:3px solid blue;float: left;padding-left: 10px ">门诊服务</h3>
      </div>
      <div style="clear: both">
        <van-grid :gutter="10">
          <van-grid-item v-for="value in 8" :key="value" icon="star-o" text="文字" />
        </van-grid>
      </div>
    </div>
    <div>
      <div>
        <h3 style="margin-left: 20px;border-left:3px solid blue;float: left;padding-left: 10px ">住院服务</h3>
      </div>
      <div style="clear: both">
        <van-grid :gutter="10">
          <van-grid-item v-for="value in 4" :key="value" icon="clock-o" text="文字" />
        </van-grid>
      </div>

    </div>
    <div>
      <div>
        <h3 style="margin-left: 20px;border-left:3px solid blue ;float: left;padding-left: 10px">医院服务</h3>
      </div>
      <div style="clear: both">
        <van-grid :gutter="10">
          <van-grid-item v-for="value in 4" :key="value" icon="clock-o" text="文字" />
        </van-grid>
      </div>

    </div>
  </div>
</template>

<script setup>

</script>

<style scoped>
.my-swipe .van-swipe-item {
  color: #fff;
  width: 100%;
  font-size: 20px;
  line-height: 150px;
  text-align: center;
  background-color: #39a9ed;
  border-radius: 10px;
}
</style>
